import React from 'react'
import { View, Text,Image} from '@tarojs/components'
import './index.less'

export default function Searchcard(props) {
  var obj = {
    ...props
  }
  return (
    <View>
      {/* 搜索详情页 */}
      {props.type=='s1'&& <View className='s1'>
        <View className='s1_box'>
          <View className='s1_left' style={'backgroundImage: url('+props.pic+')'}></View>
          <View className='s1_right'>
            <View className='s1_title'>{props.name}</View>
            <View className='s1_num'>人气值<Text>2.2万</Text></View>
            <View className='s1_time'>
              预计时间：{props.cookingtime}
            </View>
            <View className='s1_footer'>
              <View className='s1_role'>
              特点:<Text>{props.tag}</Text>
              </View>
              <View className='s1_btn' onClick={()=>props.gotoDetail(props.id)}>立刻烹饪</View>  
            </View>
            {props.islike!=='1'&&<View className='like' onClick={()=>props.handleCollect(obj)}>收藏</View>}
            {props.islike=='1'&&<View className='like' onClick={()=>props.handleDelete(props.id)}>删除</View>}
          </View>
        </View> 
      </View>}
      {/* 菜谱详情页 */}
    {  props.type=='s2'&&<View className='s2'>
        <View className='s2_box'>
          <View className='s2_left' style={'backgroundImage: url('+props.pic+')'}></View>
          <View className='s2_right'>
          <View className='s2_title'>
            <Text>菜品名称：</Text>
            <View className='s2_title_right'>{props.name}</View>
          </View>
          <View className='s2_title'>
            <Text>建议人数：</Text>
            <View className='s2_title_right'>{props.peoplenum}</View>
          </View>
          <View className='s2_title'>
            <Text>预计时间：</Text>
            <View className='s2_title_right'>{props.cookingtime}</View>
          </View>
          <View className='s2_title'>
            <Text>特点功效:</Text>
            <View className='s2_title_right'>{props.tag}</View>
          </View>
          </View>
        </View> 
      </View>}
      {/* 做菜过程 */}
      {  props.type=='s3'&&<View className='s2'>
        <View className='s2_box'>
          <View className='s2_left' style={'backgroundImage: url('+props.pic+')'}></View>
          <View className='s2_right'>
          <View className='s3_title'>
            <View className='index'>{props.index+1}</View>
            <View className='pcontent'>{props.pcontent}</View>
          </View>
          </View>
        </View> 
      </View>}
      
    </View>
  )
}
